<template>
  <form-model
    ref="createModal"
    :formTitle="$t('uploadFile')"
    :width="608"
    :form="formUploadFile"
    :rules="uploadRules"
    @ok="uploadOk"
  >
    <!-- 摘要算法 -->
    <a-form-model-item :label="$t('zysf')" prop="hashAlgorithm">
      <a-select
        v-model="formUploadFile.hashAlgorithm"
        showSearch
        allow-clear
        :placeholder="$t('pleaseSelect')"
        optionFilterProp="children"
        :filterOption="$commonFun.filterOption"
        style="width: 100%"
      >
        <a-select-option v-for="(key, val, index) in digestAlgorithm" :key="index" :value="parseInt(val, 10)">
          {{ key }}
        </a-select-option>
      </a-select>
    </a-form-model-item>
    <a-checkbox
      style="position: absolute; right: 0"
      :checked="isManualEntry"
      @change="isManualEntry = $event.target.checked"
    >
      {{ $t('manualInput') }}
    </a-checkbox>
    <!-- 摘要值 -->
    <a-form-model-item :label="$t('zyz')">
      <!-- 手动输入 -->
      <a-textarea
        v-if="isManualEntry"
        style="width: 100%"
        v-model="formUploadFile.checksum"
        :placeholder="$t('pleaseInput')"
        :rows="4"
      >
      </a-textarea>
      <!-- 自动填充 -->
      <a-textarea
        v-else
        style="width: 100%"
        disabled
        :rows="4"
        v-model="fileInfor.fileObject[digestAlgorithm[formUploadFile.hashAlgorithm]]"
      ></a-textarea>
    </a-form-model-item>
    <!-- 上传文件 -->
    <a-form-model-item>
      <template slot="label">
        <span class="requiredSty">
          {{ $t('uploadFile') }}
        </span>
      </template>
      <a-input ref="userNameInput" readOnly :value="fileInfor.fileObject.fileName" :placeholder="$t('pleaseUpload')">
        <a-icon @click="upload" slot="suffix" type="upload" />
      </a-input>
      <chunk-upload
        ref="uploadPlug"
        :showDom="false"
        fileStoreField="fileObject"
        :recordData="fileInfor"
        uploadType="1"
        :size="5 * 1024 * 1024 * 1024"
        :hashAlgorithm="formUploadFile.hashAlgorithm"
      >
      </chunk-upload>
    </a-form-model-item>
    <!-- 预计安装时间 -->
    <a-form-model-item :label="$t('estimatedInstallTime') + '(s)'" prop="installTime">
      <a-input-number
        style="width: 100%"
        v-model="formUploadFile.installTime"
        :placeholder="$t('pleaseInput') + $t('estimatedInstallTime')"
      ></a-input-number>
    </a-form-model-item>
    <!-- 文件烧写类型 -->
    <a-form-model-item :label="$t('file') + $t('sxType')" prop="dllName">
      <a-select
        v-model="formUploadFile.dllName"
        showSearch
        :placeholder="$t('pleaseSelect') + $t('file').toLowerCase() + $t('sxType').toLowerCase()"
        optionFilterProp="children"
        :filterOption="$commonFun.filterOption"
        style="width: 100%"
      >
        <a-select-option
          v-for="(item,index) in dllNameDictCode"
          :key="index"
          :value="item.value"
          :title="item.name"
        >{{ item.name }}</a-select-option>
      </a-select>
    </a-form-model-item>
  </form-model>

</template>
<script>
import FormModel from '@/components/SelfModal/FormModel'
import ChunkUpload from '@/components/Upload/ChunkUpload'
import { mapState } from 'vuex'
import { checkIsRangeInteger } from '@/utils/validate'
const initForm = {
  hashAlgorithm: 1
}
export default {
  name: 'UploadVersionFile',
  components: { FormModel, ChunkUpload },
  computed: {
    ...mapState({
      // 摘要算法
      digestAlgorithm: (state) => state.dict.digestAlgorithm,
      dllNameDictCode: (state) => state.dict.dllNameDictCode
    })
  },
  data () {
    return {
      formUploadFile: { ...initForm },
      fileInfor: { fileObject: {} },
      uploadRules: {
        hashAlgorithm: [{ required: true, message: this.$t('pleaseInput') }],
        // lxhmodifyxccode
        // eslint-disable-next-line max-len
        installTime: [{ required: true, message: this.$t('pleaseInput') }, { validator: checkIsRangeInteger(1, 2147483647) }],
        dllName: [{ required: true, message: this.$t('pleaseSelect') }]
      },
      isManualEntry: false
    }
  },
  watch: {
    'formUploadFile.hashAlgorithm': {
      handler () {
        // 切换算法后 重新上传文件
        this.fileInfor = { fileObject: {} }
        this.$refs.uploadPlug.resetUpload()
      }
    }
  },
  methods: {
    addFiles () {
      this.fileInfor = { fileObject: {} }
      this.formUploadFile = { ...initForm }
      this.$refs.createModal.visible = true
    },
    upload () {
      this.$refs.uploadPlug.upload()
    },
    uploadOk () {
      const vm = this
      const values = { ...vm.formUploadFile }
      if (vm.fileInfor.fileObject.fileId) {
        values.fileId = vm.fileInfor.fileObject.fileId
        values.fileName = vm.fileInfor.fileObject.fileName // 文件名
        values.versionType = 2 // 配置文件2 零件版本的升级包1
        // values.versionPhase = 'TEST' //测试版
        values.resourceType = 10
        // 如果是自动填充需要用生成的摘要值
        if (!vm.isManualEntry) {
          values.checksum = vm.fileInfor.fileObject[vm.digestAlgorithm[vm.formUploadFile.hashAlgorithm]]
        }
        // 手动输入时需要校验
        if (values.checksum !== vm.fileInfor.fileObject[vm.digestAlgorithm[vm.formUploadFile.hashAlgorithm]]) {
          vm.$message.warning(vm.$t('summaryIn'))
          return
        }
        vm.$refs.createModal.confirmLoading = true
        vm.$api
          .addResource(values)
          .then((res) => {
            values.resourceId = res.data;
            values.versionPhase = 'TEST';
            vm.$emit('saveFile', values)
            vm.$refs.createModal.visible = false
            vm.fileInfor = { fileObject: { uploadLoadding: false } }
            vm.$refs.uploadPlug.resetUpload()
          })
          .finally(() => {
            vm.$refs.createModal.confirmLoading = false
          })
      } else {
        vm.$message.warning(vm.$t('pleaseUpload') + vm.$t('file').toLowerCase())
      }
    }
  }
}
</script>
